import React from 'react';
import {connect} from 'dva';
import Chart from '../components/Chart';
import styles from '../styles/styles.less';
import SliderItem from '../components/SliderItem';
import Layout from '../components/Layout';
import HomeHeader from '../components/HomeHeader';
import HomeMenu from '../components/HomeMenu';
import {getCurrentMonth} from '../utils/tools';
import {gotoRouter} from '../utils/common';

function mapState(states)
{
  return { states };
}
export default connect(mapState)(function HomePage({states,dispatch,location})
{
  const model = 'home';
  let month =  getCurrentMonth();
  const state = states[model];
  const {data,loading} = states[model];
  let total = 0;
  if(!loading)
  {
    total = (parseFloat(data.cash)+parseFloat(data.bank)).toFixed(2);
  }
  let header_data = {
    title:state.name,
    total,
    income: loading ? 0 : data.income,
    outlay: loading ? 0 : data.outlay
  };
  function onSelect(month)
  {
    gotoRouter(dispatch,'/');
  }
  return (
    <Layout>
      <HomeHeader data={header_data} onSelect={onSelect} month={month} />
        <SliderItem dispatch={dispatch} data={data} />
        <HomeMenu />
    </Layout>
  );
});